<!-- 供应订单 -->
<template>
	<view class="page">
		<u-navbar :isFixed="true" title="供应订单" :borderBottom="false"></u-navbar>
		<go-top :scrollTop="scrollTop"></go-top>
		<view class="_sticky" :style="'top:'+navH+'px'">
			<!-- <view class="flex_bet_align">
				<view class="top_index red">供应订单</view>
				<navigator class="top_index " open-type="redirect" url="demandOrder" hover-class="none">求购订单</navigator>
			</view> -->
			<view class="tabs">
				<u-tabs :list="tabs" :current="order_type" active-color="#38BE8C" bg-color="#F8F8F8" @change="settype"
					bar-width="60"></u-tabs>

				<view class="P130">
					<view class="searchContent">
						<u-icon name="search" color="#B1B8C8" size="28" class="search_icon" @click="demand"></u-icon>
						<u-input v-model="searchKey" placeholder="搜索商品名称、订单编号" type="text" confirm-type="search"
							:border="false" placeholderStyle="color:#B1B8C8" class="search_" @confirm="demand"
							:clearable="false" />
						<u-icon name="close-circle" color="#C0C4CC" size="28" class="search_icon_c" @click="clear"
							v-if="searchKey.length>0">
						</u-icon>
					</view>
				</view>
			</view>
		</view>
		<block v-if="order_type<6">
			<view class="card" v-for="(item,index) in list" :key="index">
				<view class="flex_bet_align">
					<view class="buyer">买家：{{item.joinbuyers.name}}</view>
					<view class="status" v-if="item.status==1">待确认</view>
					<view class="status" v-if="item.status==2">待付款</view>
					<view class="status" v-if="item.status==3">待发货</view>
					<view class="status" v-if="item.status==4">待收货</view>
					<view class="status" v-if="item.status==5">待结算</view>
					<view class="status" v-if="item.status==6">已完成</view>
					<view class="status" v-if="item.status==7">已拒绝</view>
					<view class="status" v-if="item.status==8">已取消</view>
					<view class="status" v-if="item.status==9">待结算</view>
					<view class="status" v-if="item.status==10">售后中</view>
					<view class="status" v-if="item.status==11">售后已完成</view>
				</view>
				<view class="goods flex_align" @click="goDetail(item.id)">
					<image class="goodsImg" :src="item.getgoods.image"></image>
					<view class="content">
						<view class="goodsName clamp2">{{item.getgoods.title}}</view>
						<view class="goodsName clamp2">{{item.getgoods.spec_value}}</view>
						<view class="price">￥{{item.getgoods.money}}/{{item.getgoods.unit}}</view>
						<!-- <view class="sku">产品规格产品规格</view> -->
					</view>
				</view>
				<view class="detail"><text>购买数量：{{item.number}}{{item.getgoods.unit}}</text> 总价：￥{{item.count_price}}
				</view>
				<view class="btn_group flex_align">
					<view class="btn_fill" v-if="item.status==1" @click="goDetail(item.id)">接受订单</view>
					<view class="btn_fill" v-if="item.status==3" @click="operate(item.id,4)">立即发货</view>
					<view class="btn" v-if="item.status==1" @click="operate(item.id,7)">拒绝订单</view>
					<view class="btn" v-if="item.status==6||item.status==7||item.status==8||item.status==11"
						@click="deleteOrder(item.id)">删除订单</view>
					<!-- <view class="btn" v-if="item.status==4" @click="expressDetail(item.id)">查看物流</view> -->
					<view class="btn" @click="chat(item)">聊一聊</view>
					<view class="btn" @click="dialing(1,item.joinbuyers.id,item.joinbuyers.mobile)">联系买家</view>
				</view>
			</view>
		</block>
		<!-- 供应售后列表 -->
		<block v-if="order_type==6">
			<view class="card" v-for="(item,index) in list" :key="index">
				<view class="flex_bet_align" v-if="item.after_type==2||item.after_type==4">
					<view class="buyer">买家：{{item.joinbuyers.name}}</view>
					<view class="status" v-if="item.after_status==1">审核中</view>
					<view class="status" v-if="item.after_status==2">已通过</view>
					<view class="status" v-if="item.after_status==3">已拒绝</view>
					<view class="status" v-if="item.after_status==4">已取消</view>
					<view class="status" v-if="item.after_status==5">已回寄，待收货</view>
					<view class="status" v-if="item.after_status==6">补货中</view>
					<view class="status" v-if="item.after_status==7">回寄中</view>
					<view class="status" v-if="item.after_status==8">售后已完成</view>
					<view class="status" v-if="item.after_status==9">售后已完成</view>
				</view>
				<view class="flex_bet_align" v-if="item.after_type==1||item.after_type==3">
					<view class="buyer">买家：{{item.joinbuyers.name}}</view>
					<view class="status" v-if="item.after_status==1&&item.after_type==1">审核退款</view>
					<view class="status" v-if="item.after_status==1&&item.after_type==3">审核退货退款</view>
					<view class="status" v-if="item.after_status==2&&item.after_type==1">退款成功</view>
					<view class="status" v-if="item.after_status==2&&item.after_type==3">已通过</view>
					<view class="status" v-if="item.after_status==3">已拒绝</view>
					<view class="status" v-if="item.after_status==4">已取消</view>
					<view class="status" v-if="item.after_status==5">已回寄，待收货</view>
					<view class="status" v-if="item.after_status==6">退款成功</view>
				</view>
				<view class="goods flex_align" @click="goafterSalesDetail(item.id)">
					<image class="goodsImg" :src="item.goods_info.image"></image>
					<view class="content">
						<view class="goodsName clamp2">{{item.goods_info.title}}</view>
						<view class="goodsName clamp2">{{item.goods_info.spec_value}}</view>
						<view class="price">￥{{item.goods_info.money}}/{{item.goods_info.unit}}</view>
					</view>
				</view>
				<view class="detail"><text>购买数量：{{item.order_goods_num}}{{item.goods_info.unit}}</text>
					售后总价：￥{{item.after_money}}</view>
				<view class="btn_group flex_align">
					<view class="btn_fill"
						v-if="(item.after_status==6&&item.after_type==4)||(item.after_status==2&&item.after_type==2)"
						@click="goafterSalesDetail(item.id)">填写发货</view>
					<view class="btn_fill" v-if="item.after_status==1" @click="setAfterSale(item.id,2)">同意</view>
					<view class="btn_fill" v-if="item.after_status==5&&item.after_type==4"
						@click="setAfterSale(item.id,6)">确认收货</view>
					<view class="btn_fill" v-if="item.after_status==5&&item.after_type==3"
						@click="setAfterSale(item.id,9)">确认收货</view>
					<view class="btn" v-if="item.after_status==1" @click="setAfterSale(item.id,3)">拒绝</view>
					<view class="btn" v-if="item.after_status==4||item.after_status==11">删除订单</view>
					<view class="btn" @click="chat(item)">聊一聊</view>
					<view class="btn" @click="dialing(1,item.joinbuyers.id,item.joinbuyers.mobile)">联系买家</view>
				</view>
			</view>
		</block>
		<!-- 	<navigator url="demandOrder" open-type="redirectTo" hover-class="none" class="fixed">
			<view>求购</view>
			<view>订单</view>
		</navigator> -->
		<view class="not_more" v-if="list.length<1">
			<image src="../static/img/wdingdan.png" mode="widthFix"></image>
			<view class="text">暂无订单</view>
		</view>
		<view class="nomore" v-if="nomore&&list.length>0">—— · 没有更多了 · ——</view>

		<u-popup mode="center" border-radius="16" v-model="logistics">
			<view class="modal">
				<view class="title">物流信息</view>

				<view class="flex_align item">
					<view class="name">配送方式</view>

					<radio-group @change="radioChange">
						<view class="flex_align ml20">
							<label class="flex_align ml20" v-for="(item, index) in sendlist" :key="index">
								<view>
									<radio :value="item.value" :checked="index === current" color="#38be8c" />
								</view>
								<view>{{item.name}}</view>
							</label>
						</view>
					</radio-group>
				</view>

				<view class="flex_align item">
					<view class="name">物流公司*</view>
					<view class="check">
						<input type="text" v-model="logistics_name" :placeholder="issend?'请选择物流公司':'请输入物流公司'"
							:disabled="issend">

						<view class="labox" v-if="havelogis">
							<picker @change="setcony" mode="selector" :value="index" :range="cony" range-key="company">
								<view class="iconfont icon-down1"></view>
							</picker>
						</view>

					</view>
				</view>
				<view class="flex_align item">
					<view class="name">物流单号*</view>
					<input type="text" v-model="logistics_order_sn" placeholder="请输入物流单号">
				</view>
				<view class="flex_align item">
					<view class="name">运送车牌号</view>
					<input type="text" v-model="carnum" maxlength="10" placeholder="请输入运送车牌号">
				</view>

				<view class="flex_align item" v-if="!havelogis">
					<view class="name">联系电话</view>
					<input type="text" v-model="phone" placeholder="请输入联系电话">
				</view>
				<view class="flex_align item" v-if="!havelogis">
					<view class="name">发货时间</view>

					<picker mode="date" :value="startDate" :start="nowtime" @change="bindDateChange">
						<view class="mainline">
							<veiw class="mainlineposition">{{startDate==''?'请选择发货时间':startDate}}</veiw>
							<u-icon name="arrow-right" color="#999999" size="24" class="mainicon"></u-icon>
						</view>
					</picker>

				</view>

				<view class="flex_align item" v-if="!havelogis">
					<view class="name">预计到达时间</view>
					<picker mode="date" :value="sendDate" :start="nowtime" @change="bindSendChange">
						<view class="mainline">
							<!-- <text class="mainlineposition" v-if="!setdate">请选择预计到达时间</text> -->
							<veiw class="mainlineposition">{{sendDate==''?'请选择发货时间':sendDate}}</veiw>
							<u-icon name="arrow-right" color="#999999" size="24" class="mainicon"></u-icon>
						</view>
					</picker>

				</view>
				<view class="confirm" @click="confirm">确定</view>
			</view>
		</u-popup>
		<u-popup mode="center" border-radius="16" v-model="reason" :closeable="true">
			<view class="modal">
				<view class="title">拒绝理由</view>
				<view style="height: 20rpx;"></view>
				<u-input v-model="refuse_note" type="textarea" :border="true" placeholder="请输入拒绝理由" :maxlength="50"
					:autoHeight="true" class="mainlineinput" :clearable="false" height="200" />
				<view style="height: 20rpx;"></view>
				<u-button shape="circle" type="error" @click="refuse">确认拒绝</u-button>
				<view style="height: 20rpx;"></view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import App from '@/App.vue';
	var _this, $paginator;
	export default {
		data() {
			return {
				tabs: [{
						name: '全部'
					},
					{
						name: '待确认'
					},
					{
						name: '待发货'
					},
					{
						name: '待收货'
					},
					{
						name: '已完成'
					},
					{
						name: '待评价'
					},
					{
						name: '售后管理'
					}
				],
				order_type: 0,
				status: 0, //0待确认
				list: [],
				nomore: false,
				// 回到头部按钮距离
				scrollTop: 0,
				// 显示拒绝理由
				reason: false,
				// 拒接理由
				refuse_note: "",
				// 操作id
				operate_id: 0,
				// 显示发货填写物流信息
				logistics: false,
				// 物流单号
				logistics_order_sn: "",
				// 物流公司
				logistics_name: "",
				// 运送车牌号
				carnum: "",
				navH: 0,
				searchKey: "", // 搜索框的值
				cony: [], //物流公司
				havelogis: false, //是否有物流
				startDate: '',
				sendDate: '',
				phone: '', //手机号

				nowtime: '', //当前时间
				sendlist: [{
					value: '0',
					name: '配送'
				}, {
					value: '1',
					name: '自配',
				}],
				current: 0,

				issend: true, //配送方式
				cony_type: '', //选中物流公司的id
			}
		},
		onLoad(options) {
			console.log(options.order_type, 'order_type')
			if (options.order_type) {
				this.order_type = options.order_type
			}
			_this = this
			_this.navH = App.globalData.navHeight
			$paginator = new _this.$paginator(_this.$api)
			_this.getdata(true)

		},
		onShow() {
			_this.getTime()
		},
		//监听页面滚动
		onPageScroll(res) {
			this.scrollTop = res.scrollTop
		},
		//下拉刷新
		onPullDownRefresh() {
			if (_this.order_type == 6) {
				$paginator = new _this.$paginator(_this.$api)
				_this.getafterSale(true)
			} else {
				$paginator = new _this.$paginator(_this.$api)
				_this.getdata(true)
			}
		},
		onReachBottom: function() {
			$paginator.nextPager(() => {
				_this.getdata()
			})
		},
		methods: {
			// 查询数据
			demand() {
				if (_this.order_type == 6) {
					$paginator = new _this.$paginator(_this.$api)
					_this.getafterSale(true)
				} else {
					$paginator = new _this.$paginator(_this.$api)
					_this.getdata(true)
				}
			},
			clear() {
				_this.searchKey = ""
				console.log(_this.searchKey)
				if (_this.order_type == 6) {
					$paginator = new _this.$paginator(_this.$api)
					_this.getafterSale(true)
				} else {
					$paginator = new _this.$paginator(_this.$api)
					_this.getdata(true)
				}
			},
			//内层刷新这层
			isonshow() {
				if (_this.order_type == 6) {
					$paginator = new _this.$paginator(_this.$api)
					_this.getafterSale(true)
				} else {
					$paginator = new _this.$paginator(_this.$api)
					_this.getdata(true)
				}
			},
			getdata: function(firstLoad = false) {
				let data = {}
				data.tab_type = 2
				data.search = _this.searchKey
				data.order_type = _this.order_type
				if (_this.order_type == 2) {
					data.order_type = 3
				} else if (_this.order_type == 3) {
					data.order_type = 4
				} else if (_this.order_type == 4) {
					data.order_type = 6
				}

				console.log(data.order_type)
				$paginator.getData('getmyorder', data, (data) => {
					if (firstLoad) {
						_this.list = data.list ? data.list : []
					} else {
						_this.list = _this.list.concat(data.list)
					}
					_this.nomore = data.nomore
				})
			},
			getafterSale: function(firstLoad = false) {
				$paginator.getData('getafterorder', {
					tab_type: 2,
					search: _this.searchKey
				}, (data) => {
					if (firstLoad) {
						_this.list = data.list ? data.list : []
					} else {
						_this.list = _this.list.concat(data.list)
					}
					_this.nomore = data.nomore
				})
			},
			// 设置状态
			settype(e) {
				_this.list = []
				_this.order_type = e
				_this.searchKey = ""
				console.log(_this.order_type, '切换')
				if (e == 6) {
					$paginator = new _this.$paginator(_this.$api)
					_this.getafterSale(true)
				} else {
					$paginator = new _this.$paginator(_this.$api)
					_this.getdata(true)
				}
			},
			// 跳转到详情
			goDetail(id) {
				uni.navigateTo({
					url: "/personal/orderDetail?type=0&id=" + id
				})
			},
			//订单操作
			operate(id, type) {
				if (type == 1) {
					uni.navigateTo({
						url: "/personal/orderDetail?type=0&id=" + id
					})
				}
				if (type == 2) {
					uni.showModal({
						content: '确认接受订单？',
						success: function(res) {
							if (res.confirm) {
								_this.$api.post("myorderoperate", {
									order_id: id,
									order_status: type
								}).then(data => {
									$paginator = new _this.$paginator(_this.$api)
									_this.getdata(true)
								});
							}
						}
					});
				}
				if (type == 7) {
					_this.reason = true
					_this.operate_id = id
				}
				if (type == 6) {
					_this.logistics = true
					_this.operate_id = id
				}
				if (type == 4) {
					//发货 获取物流公司
					_this.$api.get("getLogistics").then(data => {
						console.log(data.length)
						if (data.length > 0) {
							_this.havelogis = true
							_this.cony = data
						} else {
							_this.havelogis = false
						}

						_this.logistics = true
						_this.operate_id = id
					});


				}
			},
			deleteOrder(id) {
				uni.showModal({
					content: '确认删除订单？',
					success: function(res) {
						if (res.confirm) {
							_this.$api.get("delmyorder", {
								order_id: id
							}).then(data => {
								$paginator = new _this.$paginator(_this.$api)
								_this.getdata(true)
							});
						}
					}
				});
			},
			// 发货提交物流信息
			confirm() {
				console.log(_this.logistics_name, _this.logistics_order_sn, _this.carnum, _this.phone, _this.startDate,
					_this.sendDate, _this.cony_type, _this.issend)
				let data = [{
					value: _this.logistics_name,
					type: 1,
					title: "请填写物流公司名称"
				}, {
					value: _this.logistics_order_sn,
					type: 1,
					title: "请填写物流单号"
				}]
				if (_this.$plug.verify(data)) {
					_this.$api.post("myorderoperate", {
						order_status: 4,
						logistics_name: _this.logistics_name,
						logistics_order_sn: _this.logistics_order_sn,
						order_id: _this.operate_id,
						carnum: _this.carnum,
						logistics_tel: _this.phone,
						logistics_send_time: _this.startDate,
						logistics_yjdd_time: _this.sendDate,
						logistics_type: _this.cony_type,
						logistics_tab_type: _this.issend ? 1 : 2
					}).then(data => {
						$paginator = new _this.$paginator(_this.$api)
						_this.getdata(true)
						_this.logistics_name = ""
						_this.logistics_order_sn = ""
						_this.carnum = ""
						_this.logistics = false
					});
				}
			},
			// 查看物流
			expressDetail(id) {
				uni.navigateTo({
					url: "expressDetail?id=" + id
				})
			},
			//拒绝订单
			refuse() {
				if (_this.refuse_note.length < 1) {
					uni.showToast({
						title: "请输入拒绝理由",
						icon: "none"
					})
				} else {
					_this.$api.post("myorderoperate", {
						order_id: _this.operate_id,
						refuse_note: _this.refuse_note,
						order_status: 7
					}).then(data => {
						$paginator = new _this.$paginator(_this.$api)
						_this.getdata(true)
						_this.refuse_note = ""
						_this.reason = false
					});
				}
			},
			//跳转到售后详情
			goafterSalesDetail(id) {
				uni.navigateTo({
					url: "/personal/afterSalesDetail?type=0&id=" + id
				})
			},
			// 售后订单操作
			setAfterSale(id, type) {
				if (type == 2 || type == 3 || type == 6 || type == 9) {
					let title = "确认本次操作"
					if (type == 2) {
						title = "同意申请？"
					} else if (type == 3) {
						title = "确认拒绝申请？"
					} else if (type == 6) {
						title = "确认收货？"
					} else if (type == 9) {
						title = "确认收货？"
					}
					uni.showModal({
						content: title,
						success: function(res) {
							if (res.confirm) {
								_this.$api.post("afteroperation", {
									after_id: id,
									after_status: type
								}).then(data => {
									$paginator = new _this.$paginator(_this.$api)
									_this.getafterSale(true)
								});
							}
						}
					});
				}
			},
			//拨号并记录
			dialing(type, other_uid, mobile) {
				_this.$api.islogin(function() {
					_this.$api.post("calllog", {
						calllog_uid: other_uid,
						call_type: type
					}).then(data => {
						_this.$plug.dialing(mobile)
					});
				})
			},

			// 选择物流公司
			setcony: function(e) {
				console.log('picker发送选择改变，携带值为', e.detail.value)
				_this.cony_type = _this.cony[e.detail.value].type
				_this.logistics_name = _this.cony[e.detail.value].company
			},

			// 选择发货时间
			bindDateChange: function(e) {
				_this.startDate = e.target.value
				console.log(_this.startDate)
			},
			bindSendChange: function(e) {
				_this.sendDate = e.target.value
				console.log(_this.sendDate)
			},

			//切换配送方式
			radioChange: function(e) {
				console.log(e.target.value)
				if (e.target.value == 0) {
					_this.issend = true
					_this.havelogis = true
					_this.logistics_name = ''
					_this.logistics_order_sn = ''
					_this.carnum = ''
					_this.phone = ''
					_this.startDate = ''
					_this.sendDate = ''
				} else {
					_this.havelogis = false
					_this.issend = false
					_this.logistics_name = ''
					_this.logistics_order_sn = ''
					_this.carnum = ''
					_this.phone = ''
					_this.startDate = ''
					_this.sendDate = ''
				}
			},

			getTime() {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				this.nowtime = `${year}-${month}-${day}`
				console.log(`${year}-${month}-${day}`, this.nowtime)
				return `${year}-${month}-${day}`;
			},
			// 跳转到聊天
			chat(item) {
				// console.log(item)
				let images = []
				if (item.getgoods) {
					item.getgoods.number = item.number
					item.getgoods.name = item.joinbuyers.name
					item.getgoods.client_uid = item.joinbuyers.id
					images.push(item.getgoods.image)
					item.getgoods.images = images

					wx.setStorageSync('list', item.getgoods)

					console.log(item)
					uni.navigateTo({
						url: '../chat/chatingroom?type=5' + '&member_type=1'
					})
				} else {
					item.goods_info.number = item.order_goods_num
					item.goods_info.name = item.joinbuyers.name
					item.goods_info.client_uid = item.joinbuyers.id

					images.push(item.goods_info.image)
					item.goods_info.images = images

					wx.setStorageSync('list', item.goods_info)
					console.log(item)
					uni.navigateTo({
						url: '../chat/chatingroom?type=5' + '&member_type=1'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		background-color: #F8F8F8;
		padding-bottom: env(safe-area-inset-bottom);
		min-height: 100vh;
	}

	._sticky {
		position: sticky;
		background: #fff;
		z-index: 9;

		.P130 {
			padding: 10rpx 30rpx;
		}

		.searchContent {
			width: 100%;
			height: 74rpx;
			border-radius: 37rpx;
			background: #fff;
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-right: 28rpx;

			.search_icon {
				margin-left: 32rpx;
			}

			.search_icon_c {
				margin-right: 32rpx;
			}

			.search_ {
				color: #2C3240;
				font-size: 26rpx;
				flex: 1;
				margin: 0 14rpx;
			}
		}
	}



	.tabs {
		padding: 10rpx 0;
		position: sticky;
		top: 0rpx;
		background-color: #F8F8F8;
	}

	.top_index {
		width: 50%;
		line-height: 88rpx;
		text-align: center;
	}

	.red {
		color: #38BE8C;
	}

	.card {
		background-color: #FFFFFF;
		padding: 24rpx 30rpx;
		margin-bottom: 20rpx;

		.buyer {
			font-size: 28rpx;
			color: #333333;
		}

		.status {
			font-size: 28rpx;
			color: #999999;
		}

		.goods {
			padding: 28rpx 0 38rpx;
			border-bottom: 1rpx solid #EEEEEE;

			.goodsImg {
				width: 180rpx;
				height: 180rpx;
				background: #EEEEEE;
				margin-right: 22rpx;
			}

			.content {
				width: 480rpx;
			}

			.goodsName {
				font-size: 28rpx;
				color: #333333;
				line-height: 36rpx;
				height: 72rpx;
			}

			.price {
				font-size: 24rpx;
				font-weight: 500;
				color: #f73f3f;
				margin: 8rpx 0 14rpx;
			}

			.sku {
				font-size: 24rpx;
				color: #999999;
			}
		}

		.detail {
			font-size: 28rpx;
			font-weight: 500;
			text-align: right;
			color: #333333;
			margin: 30rpx 0;

			text {
				margin-right: 20rpx;
			}
		}

		.btn_group {
			flex-direction: row-reverse;
		}

		.btn {
			width: 152rpx;
			height: 70rpx;
			background: #ffffff;
			border: 1rpx solid #333333;
			border-radius: 37rpx;
			font-size: 26rpx;
			font-weight: 400;
			text-align: center;
			line-height: 70rpx;
			color: #333333;
			margin-left: 26rpx;

			&:last-child {
				margin-left: 0;
			}
		}

		.btn_fill {
			width: 152rpx;
			height: 70rpx;
			background: linear-gradient(90deg, #38be8c, #06adba 96%);
			border-radius: 36rpx;
			font-size: 26rpx;
			text-align: center;
			line-height: 70rpx;
			color: #ffffff;
			margin-left: 26rpx;
		}
	}

	.fixed {
		width: 116rpx;
		height: 114rpx;
		background: linear-gradient(90deg, #38be8c, #06adba 96%);
		border-radius: 58rpx;
		box-shadow: 0rpx 6rpx 12rpx 0rpx #c3e5dc;
		text-align: center;
		color: #ffffff;
		padding-top: 20rpx;
		position: fixed;
		right: 32rpx;
		bottom: 488rpx;
		box-sizing: border-box;
	}

	.modal {
		width: 660rpx;
		text-align: center;
		padding: 40rpx 40rpx 10rpx;

		.title {
			font-size: 36rpx;
			font-weight: 700;
			text-align: center;
			color: #030517;
			line-height: 48rpx;
			margin-bottom: 36rpx;
		}

		.name {
			font-size: 28rpx;
			color: #333333;
			line-height: 90rpx;
			width: 175rpx;
			text-align: left;
		}

		.item {
			margin-bottom: 26rpx;
		}

		input {
			height: 90rpx;
			border: 1rpx solid #999999;
			font-size: 28rpx;
			padding: 25rpx 22rpx;
			margin-left: 20rpx;
			flex: 1;
			text-align: left;
		}

		.confirm {
			font-size: 32rpx;
			font-weight: 700;
			text-align: center;
			color: #38be8c;
			padding: 29rpx 0 26rpx;
			border-top: 1rpx solid #FAFAFA;
			margin-top: 40rpx;
		}

		.mainline {
			height: 90rpx;
			font-size: 28rpx;
			padding: 25rpx 22rpx;
			flex: 1;
			text-align: left;

			.mainlineposition {
				margin-right: 10rpx;
			}
		}

		.ml20 {
			margin-left: 20rpx;
		}

		.check {
			flex: 1;
			position: relative;
			display: flex;
			// align-items: center;

			input {
				padding-right: 65rpx;
			}

			.labox {
				height: 90rpx;
				width: 90rpx;
				position: absolute;
				right: 0;
				z-index: 10;
			}

			.iconfont {
				height: 90rpx;
				line-height: 90rpx;
				transform: rotate(-90deg);
			}
		}
	}
</style>
